var cssSrc = './less';
var cssDst = './css';
var gulp = require('gulp'),
    plugins = require('gulp-load-plugins')(),
    browserSync = require('browser-sync').create(),
    reload = browserSync.reload;

gulp.task('concat-css', function() {
    return gulp.src([cssDst + '/*.css', '!' + cssDst + '/all.css'])
        .pipe(plugins.concat('all.css'))
        .pipe(gulp.dest(cssDst));
});

gulp.task('clean-css', function() {
    return gulp.src([cssDst + '/*.css'], {
            read: false
        })
        .pipe(plugins.clean({
            force: true
        }));
});

gulp.task('build-css',  function() {
    return gulp.src([cssSrc + '/base.less'])
        .pipe(plugins.less())
        .pipe(plugins.rem({
            width: 640,
            unit: 'pm'
        }))
        .pipe(plugins.autoprefixer({
            browsers: [
                'ie >= 9',
                'ff >= 10',
                'chrome >= 20',
                'safari >= 7',
                'opera >= 10',
                'ios >= 7',
                'android >= 2.3'
            ]
        }))
        .pipe(plugins.cssmin())
        .pipe(gulp.dest(cssDst))
        .pipe(reload({
            stream: true
        }));;
});

gulp.task('build-all', ['build-css'], function() {
    console.log('Build all files finish.');
});

gulp.task('server',function() {

    browserSync.init({
        server: "./"
    });

    gulp.watch([cssSrc + '/*.less', cssSrc + '/**/*.less'], ['build-css']);
    gulp.watch("./html/*.html").on('change', reload);
    gulp.watch("./js/*.js").on('change', reload);
});


gulp.task('watch', function() {
    gulp.watch([cssSrc + '/*.less', cssSrc + '/**/*.less'], ['build-all']).on('change', function(event) {
        console.log('Event type: ' + event.type);
        console.log('Event path: ' + event.path);
    });
});


gulp.task('default', ['build-all'], function() {
    console.log('Build all files finish.');
});